<template>
	<view class="content" v-show="isShow">
		<view class="uni-flex-top" v-if="!isEmpty(list)">
			<view class="score">考试分数：{{list.score}}</view>
			<view class="note">
				错题为红色，点击可查看题目。
			</view>
		</view>
		
		<!--主体-->
		<view class="uni-flex-main uni-top-20" v-show="isShow">
			<view class="uni-top-title" v-if="!isEmpty(radioList)">
				<!-- 一、单选题： -->
				{{radioList.title}}  <text class="subtitle">{{radioList.subtitle}}</text>
			</view>
			<view  class="numList" v-if="!isEmpty(radioList)">
				<text class="numInfo" :class="item.status==0?'active':item.userAnswersRight==1?'':'error'" v-for="(item,index) in radioList.listmatter" v-if="!isEmpty(radioList.listmatter)" @click="gotoDetail(item)">{{item.index}}</text>
			</view>
			
			<view class="uni-top-title" v-if="!isEmpty(multipleList)">
				<!-- 二、多选题： -->
				{{multipleList.title}}  <text class="subtitle">{{multipleList.subtitle}}</text>
			</view>
			<view class="numList" v-if="!isEmpty(multipleList)">
				<text class="numInfo" :class="item.status==0?'active':item.userAnswersRight==1?'':'error'" v-for="(item,index) in multipleList.listmatter" v-if="!isEmpty(multipleList.listmatter)" @click="gotoDetail(item)">{{item.index}}</text>
			</view>
			
			<view class="uni-top-title" v-if="!isEmpty(judgeList)">
				<!-- 三、判断题： -->
				{{judgeList.title}}  <text class="subtitle">{{judgeList.subtitle}}</text>
			</view>
			<view  class="numList" v-if="!isEmpty(judgeList)">
				<text class="numInfo" :class="item.status==0?'active':item.userAnswersRight==1?'':'error'" v-for="(item,index) in judgeList.listmatter" v-if="!isEmpty(judgeList.listmatter)" @click="gotoDetail(item)">{{item.index}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	const util = require('@/common/util.js')
	const request = require('@/common/request.js')
	import {mapState} from 'vuex'
	
	export default {
		components:{
			
		},
		data() {
			return {
				title: '集团制度考试',
				isShow: false,
				showSureBtn: false,
				authKey: null,
				color: '#FB5259',
				splitorColor: '#FB5259',
				disabled:false,
				loading:false,
				radioList:null,
				multipleList:null,
				judgeList:null,
				chooseType:0,
				type:'center',
				popupContent:'',
				topics:0, //未完成的题目
				list:null        //数据
			}
		},
		filters: {
			formatDate: function (value) {
				return util.formatSeconds(value)
			}
		},
		computed: {
			...mapState(['vote_url','currTime','examState'])
		},
		onLoad(option) {
			this.authKey = !util.isEmpty(option.authKey) ? option.authKey : "";
			// if(!this.examState){
			// 	uni.redirectTo({
			// 		url:'/pages/index/index?authKey=' + this.authKey
			// 	})
			// }
			// this.second = this.currTime
			this.loadData()
		},
		methods: {
			async loadData() {
				let that = this;
				let url = this.vote_url;
				let opts = {url: url,method: "POST"};
				let param = {id: 2,method: "exam_statisticspaper",params: {
						authKey: that.authKey
					}
				}
				console.log(JSON.stringify(param))
				uni.showLoading({title: '正在加载......'})
				request.baseRequest(opts, param).then((res) => {
					if(!util.isEmpty(res)){
						console.log(JSON.stringify(res))
						//that.itemObj = res
						that.list = res
						if(!util.isEmpty(that.list.radioList)){
							that.radioList = that.list.radioList
						}
						if(!util.isEmpty(that.list.multipleList)){
							that.multipleList = that.list.multipleList
						}
						if(!util.isEmpty(that.list.judgeList)){
							that.judgeList = that.list.judgeList
						}
						that.showSureBtn = res.canhand
					}
					that.isShow = true
					uni.hideLoading()
				},(error) => {
						console.log(JSON.stringify(error))
						that.isShow = true
						uni.hideLoading()
						uni.showToast({title: error.message, duration: 1500, mask: true, icon: "none"})
					}
				)
			},
			doSure(){
				let that = this;
				let url = this.vote_url;
				let opts = {url: url,method: "POST"};
				let param = {id: 2,method: "exam_handpaper",params: {
						authKey: that.authKey
					}
				}
				that.loading = true
				that.disabled = true
				
				uni.showLoading({title: '正在加载...'})
				console.log(JSON.stringify(param))
				request.baseRequest(opts, param).then((ress) => {
					console.log(JSON.stringify(ress))
					if(!util.isEmpty(ress)){
						uni.showModal({
							title: '提示',
							content: ress.msg,
							confirmColor: '#000000',
							showCancel:false,
							success: function(res) {
								if (res.confirm) {
									uni.redirectTo({
									    url: '/pages/beginans/handpaper?data='+JSON.stringify(ress)+"&authKey="+that.authKey
									});
								}
							}
						});
					}
					uni.hideLoading()
				},(error) => {
						console.log(JSON.stringify(error))
						that.loading = false
						that.disabled = false
						uni.showToast({title: error.message, duration: 1500, mask: true, icon: "none"})
					}
				)
				//提交
				console.log("123")
			},
			/**
			 * 打开基础内容
			 */
			toggle(type) {
				//看是否还有漏题
				let that = this;
				let url = this.vote_url;
				let opts = {url: url,method: "POST"};
				let param = {id: 2,method: "exam_manualhandpaper",params: {
						authKey: that.authKey
					}
				}
				request.baseRequest(opts, param).then((ress) => {
					console.log(JSON.stringify(ress))
					if(!util.isEmpty(ress)){
						that.topics = ress.topics
						that.popupContent = that.currTime
						that.type = type
						that.$refs.popup.open()
					}
				},(error) => {
						console.log(JSON.stringify(error))
						uni.showToast({title: error.message, duration: 1500, mask: true, icon: "none"})
					}
				)
			},
			isEmpty(value){
				return util.isEmpty(value);
			},
			close() {
				this.$refs.popup.close()
			},
			timeup(){
				//结束
				let that = this;
				let url = this.vote_url;
				let opts = {url: url,method: "POST"};
				let param = {id: 2,method: "exam_handpaper",params: {
						authKey: that.authKey
					}
				}
				that.loading = true
				that.disabled = true
				
				uni.showLoading({title: '时间到...'})
				request.baseRequest(opts, param).then((ress) => {
					console.log(JSON.stringify(ress))
					if(!util.isEmpty(ress)){
						uni.showModal({
							title: '提示',
							content: "考试时间已到，系统自动帮您提交试卷",
							confirmColor: '#000000',
							showCancel:false,
							success: function(res) {
								if (res.confirm) {
									uni.redirectTo({
									    url: '/pages/beginans/handpaper?data='+JSON.stringify(ress)+"&authKey="+that.authKey
									});
								}
							}
						});
					}
					uni.hideLoading()
				},(error) => {
						//console.log(JSON.stringify(error))
						that.loading = false
						that.disabled = false
						uni.showToast({title: error.message, duration: 1500, mask: true, icon: "none"})
					}
				)
				//提交
				console.log("提交")
			},
			change(){
				
			},
			gotoDetail(item){
				console.log(JSON.stringify(item))
				uni.navigateTo({
					url:'/pages/result/answerdetail?uid='+item.questionsId+"&authKey="+this.authKey
				})
			}
		}
	}
</script>

<style lang="scss">
	%uni-flex {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
		
	}

	%uni-flex-inline {
		display: inline-flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
	}

	.content {
		@extend %uni-flex;
		background: white;
		min-height: 100%;
		justify-content: flex-start;
		
		.uni-flex-top{
			@extend %uni-flex;
			width: 100%;
			background: transparent;
			flex-direction: row;
			justify-content: space-between;
			min-height:90upx;
			border-top:1upx solid #efefef;
			border-bottom:1upx solid #efefef;
			justify-content: center;
			font-weight: 400;
			font-size: 34upx;
			color: red;
			flex-direction: column;
			.note{
				margin-bottom:20upx;
				font-weight: bold;
				color: black;
			}
			.score{
				margin-top:20upx;
				font-size: 32upx;
				font-weight: bold;
			}
		}
		
		.uni-flex-main{
			width:100%;
			background: transparent;
			margin-top: 5upx;
			border-radius: 10upx;
			
			
			&.uni-top-20{
				.numList{
					padding: 5px 10px 20px 20px;
					padding-left:20upx;
					
					border-bottom:1upx solid #efefef;
					.numInfo{
						display: inline-block;
						width:40upx;
						height:40upx;
						line-height: 40upx;
						border-radius: 100%;
						background: rgb(71, 236, 232);
						color: white;
						padding: 5upx;
						margin-top: 20upx;
						margin-left: 20upx;
						text-align: center;
					}
					.numInfo.active{
						background: transparent;
						color: rgb(33, 163, 247);
						border: 1upx solid rgb(33, 163, 247);
					}
					.numInfo.error{
						background: red;
						color: white;
						border: red;
					}
				}
				.uni-top-title{
					padding-left: 20upx;
					font-weight: bold;
					.subtitle{
						padding-left:24upx;
						color: red;
					}
				}
			}
		}
	}
</style>
